import IconApp from '@/components/icon/IconApp';
import IconBiliBili from '@/components/icon/IconBiliBili';
import IconDouyin from '@/components/icon/IconDouyin';
import IconKuaishou from '@/components/icon/IconKuaishou';
import IconToutiao from '@/components/icon/IconToutiao';
import IconWeb from '@/components/icon/IconWeb';
import IconWeChatChannels from '@/components/icon/IconWeChatChannels';
import IconWeChatOfficialAccount from '@/components/icon/IconWeChatOfficialAccount';
import IconWeibo from '@/components/icon/IconWeibo';
import TagGroup from '@/components/TagGroup';
import {
  saveRecordQuerySubmitVerify,
  selectRecord,
  updateRecord,
} from '@/services/api/api-assess-week-emphasize-record';
import { CheckCircleOutlined, CheckCircleTwoTone, CloseCircleTwoTone } from '@ant-design/icons';
import {
  ActionType,
  ModalForm,
  ProFormDatePicker,
  ProFormRadio,
  ProFormTextArea,
  ProList,
  ProTable,
} from '@ant-design/pro-components';
import { DrawerForm, ProFormInstance } from '@ant-design/pro-form';
import {
  Alert,
  Button,
  Descriptions,
  Divider,
  Flex,
  Form,
  message,
  Space,
  Tag,
  Typography,
  Upload,
} from 'antd';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
import React, { useRef, useState } from 'react';
import { useAccess } from 'umi';
import AddRecordProve from './AddRecordProve';
import DetailRecord from './DetailRecord';
import EditRecordProve from './EditRecordProve';
interface EditRecordProps {
  id: string;
  onRefurbish: () => void;
}
const EditRecord: React.FC<EditRecordProps> = ({ id, onRefurbish }) => {
  const access = useAccess();

  const formRefDrawerForm = useRef<ProFormInstance>();
  const userRefProList = useRef<ActionType>();

  /**
   * 提交窗口
   */
  const [modalFormOpen, setModalFormOpenState] = useState<boolean>(false);

  /**
   *  查询提交
   */
  const [querySubmitParamReportType, setQuerySubmitParamReportTypeState] = useState<number>();
  const [querySubmitParamReleaseDate, setQuerySubmitParamReleaseDateState] = useState<string>();

  /**
   * 查询提交状态
   * 0 默认
   * 1 可提交
   * 2 不可提交有占用
   */
  const [querySubmitVerifyState, setQuerySubmitStateState] =
    useState<AssessWeekEmphasizeRecordData.RecordQuerySubmitVerify>();

  //互动数据
  const [interactionData, setInteractionDataState] = useState<any>();

  /**
   * 发布数据
   */
  const [saveProves, setSaveProveState] = useState<AssessWeekEmphasizeProveBo.ProveData[]>([]);

  const verificationSubmit = (values: any) => {
    if (values.releaseDate === undefined) {
      message.warning('请选择日期');
      return false;
    }

    if (!(values.name !== undefined)) {
      message.warning('请输入标题');
      return false;
    }

    values.name = values.name.trim();

    if (!(values?.name.length > 0)) {
      message.warning('请输入标题');
      return false;
    }

    if (!(values?.authors?.length > 0)) {
      message.warning('请添加作者');
      return false;
    }

    if (!(values?.reason?.length > 0)) {
      message.warning('请输入推荐理由');
      return false;
    }

    if (values?.reason?.length > 200) {
      message.warning('推荐理由字数超过200个字符');
      return false;
    }

    if (saveProves.length == 0) {
      message.warning('请添加发布平台数据');
      return false;
    }

    return true;
  };

  /**
   * 加载来源详情
   * @param key
   */
  const loadSaveRecordVerify = async (
    reportType: number | undefined,
    releaseDate: string | undefined,
  ) => {
    try {
      setQuerySubmitParamReportTypeState(reportType);
      setQuerySubmitParamReleaseDateState(releaseDate);

      const response = await saveRecordQuerySubmitVerify({
        reportType: reportType,
        releaseDate: releaseDate,
      });
      if (response.code === 0) {
        const data = response.data;

        if (data?.records?.map((item) => item.id).includes(id)) {
          setQuerySubmitStateState({
            ...data,
            isVerify: 1,
          });
        } else {
          setQuerySubmitStateState(data);
        }
      } else {
        setQuerySubmitStateState(undefined);
      }
    } catch (error) {}
  };

  const [details, setDetailsState] = useState<AssessWeekEmphasizeRecordData.SelectRecord>();

  /**
   * 获取 详情
   * @param key
   */
  const loadDetails = async () => {
    try {
      const response = await selectRecord({ id });
      if (response.code === 0) {
        const details = response.data;
        setDetailsState(response.data);

        loadSaveRecordVerify(details.dataReportType, details.dataReleaseTime);

        formRefDrawerForm.current?.setFieldsValue({
          reportType: details.dataReportType,
          releaseDate: details.dataReleaseTime,
          name: details.dataName,
          authors: details.authors,
          reason: details.reason,
        });

        setInteractionDataState({
          dataReadCount: 0,
          dataPlayCount: 0,
          dataLikeCount: 0,
          dataCollectCount: 0,
        });

        const proves = details.proves.map((item) => {
          return {
            ...item,
            id: item.id,
            appointSourceId: item.appointSourceId,
            appointSourceType: item.appointSourceType,
            appointSourceName: item.datahubSourceName,
            appointSourceChannelId: item.datahubChannelId,
            appointSourceChannelName: item.datahubChannelName,
            url: item.dataUrl,
            dataReadCount: item.dataReadCount,
            dataPlayCount: item.dataPlayCount,
            dataLikeCount: item.dataLikeCount,
            dataCollectCount: item.dataCollectCount,
            attachments: item.attachments?.map((a) => {
              return {
                uid: a.id,
                id: a.id,
                mimeType: a.mimeType,
                name: a.name,
                url: a.content,
                thumbUrl: a.content,
                status: 'done',
                file: {
                  uid: a.id,
                  id: a.id,
                  mimeType: a.mimeType,
                  name: a.name,
                  url: a.content,
                  thumbUrl: a.content,
                  status: 'done',
                },
              };
            }),
            remarks: item.remarks,
          };
        });

        /**
         * 阅读量【自媒体、社交媒体等平台的文章被阅读次数】
         */
        let dataReadCount: number | undefined = undefined;

        /**
         * 播放量【抖音、快手等视频站点的视频播放次数】
         */
        let dataPlayCount: number | undefined = undefined;

        /**
         * 点赞量【自媒体、社交媒体等平台的发布文章被点赞次数】
         */
        let dataLikeCount = 0;
        /**
         * 转发量
         */
        let dataCollectCount = 0;

        proves.forEach((item) => {
          if (
            item.appointSourceChannelName == '微信公众号' ||
            item.appointSourceChannelName == '微博' ||
            item.appointSourceChannelName == '今日头条' ||
            item.appointSourceChannelName == '客户端' ||
            item.appointSourceChannelName == '网站'
          ) {
            if (dataReadCount == undefined) {
              dataReadCount = 0;
            }

            dataReadCount = dataReadCount + item.dataReadCount;
          } else {
            if (dataPlayCount == undefined) {
              dataPlayCount = 0;
            }

            dataPlayCount = dataPlayCount + item.dataPlayCount;
          }
          dataLikeCount = dataLikeCount + item.dataLikeCount;
          dataCollectCount = dataCollectCount + item.dataCollectCount;
        });

        setInteractionDataState({
          dataReadCount,
          dataPlayCount,
          dataLikeCount,
          dataCollectCount,
        });

        setSaveProveState(proves);
      }
    } catch (error) {}
  };

  return (
    <DrawerForm
      key="edit_assess_emphasize_record_drawer_form"
      title={'编辑'}
      drawerProps={{
        width: 650,
        maskClosable: false,
        destroyOnClose: true,
      }}
      layout="horizontal"
      formRef={formRefDrawerForm}
      trigger={<Button type="primary">编辑</Button>}
      initialValues={{}}
      onOpenChange={(visible) => {
        if (visible) {
          setQuerySubmitStateState(undefined);

          setQuerySubmitParamReportTypeState(undefined);
          setQuerySubmitParamReleaseDateState(undefined);
          setInteractionDataState(undefined);
          setSaveProveState([]);
          loadDetails();
        } else {
          setQuerySubmitStateState(undefined);

          setQuerySubmitParamReportTypeState(undefined);
          setQuerySubmitParamReleaseDateState(undefined);
          setInteractionDataState(undefined);
          setSaveProveState([]);
        }
      }}
      submitter={{
        submitButtonProps: {
          style: {
            display: 'none',
          },
        },
        render: (props, defaultDoms) => {
          return [
            ...defaultDoms,
            <Button
              hidden={
                !(
                  querySubmitParamReportType &&
                  querySubmitParamReleaseDate &&
                  querySubmitVerifyState != undefined &&
                  querySubmitVerifyState.isVerify == 1
                )
              }
              key="button_release_state_discard"
              icon={<CheckCircleOutlined />}
              type="primary"
              style={{
                background: '#87d068',
              }}
              onClick={() => {
                const values = formRefDrawerForm.current?.getFieldsValue();

                if (!verificationSubmit(values)) {
                  return;
                }

                setModalFormOpenState(true);
              }}
            >
              提交
            </Button>,
            <ModalForm
              key={'modal_form_release_state_discard'}
              title={
                <>
                  <CheckCircleTwoTone
                    style={{
                      marginRight: 8,
                    }}
                    twoToneColor="#87d068"
                  />
                  确认提交
                </>
              }
              autoFocusFirstInput
              modalProps={{
                width: 400,
                destroyOnClose: true,
                onCancel: () => console.log('run'),
              }}
              open={modalFormOpen}
              onOpenChange={setModalFormOpenState}
              submitTimeout={2000}
              submitter={{
                submitButtonProps: {
                  type: 'primary',
                  style: { background: '#87d068' },
                },
              }}
              onFinish={async (values) => {
                props.submit();
                return true;
              }}
            />,
          ];
        },
      }}
      onChange={(values: any) => {}}
      onFinish={async (values) => {
        if (!verificationSubmit(values)) {
          return false;
        }

        values.releaseTime = values.releaseDate;

        console.log('===updateRecord=====', {
          id: id,
          reportType: values.reportType,
          releaseTime: values.releaseTime,
          name: values.name,
          authors: values.authors,
          reason: values.reason,
          proves: saveProves.map((item) => {
            return {
              id: item.id,
              appointSourceId: item.appointSourceId,
              url: item.url,
              attachmentIds: item?.attachments?.map((entity) => entity.id),
              dataReadCount: item.dataReadCount,
              dataPlayCount: item.dataPlayCount,
              dataLikeCount: item.dataLikeCount,
              dataCollectCount: item.dataCollectCount,
              remarks: item.remarks,
            };
          }),
        });

        const response = await updateRecord({
          id: id,
          reportType: values.reportType,
          releaseTime: values.releaseTime,
          name: values.name,
          authors: values.authors,
          reason: values.reason,
          proves: saveProves.map((item) => {
            return {
              id: item.id,
              appointSourceId: item.appointSourceId,
              url: item.url,
              attachmentIds: item?.attachments?.map((entity) => entity.id),
              dataReadCount: item.dataReadCount,
              dataPlayCount: item.dataPlayCount,
              dataLikeCount: item.dataLikeCount,
              dataCollectCount: item.dataCollectCount,
              remarks: item.remarks,
            };
          }),
        });

        if (response.code === 0) {
          message.success('提交成功');
          onRefurbish();
          return true;
        } else {
          return false;
        }
      }}
    >
      <Alert
        message="三好作品统计范围为微博、微信公众号、抖音、微信视频号、今日头条号、客户端，可以填报同一稿件，多个平台链接，阅读量、播放量、转发数、点赞数累加计算。"
        type="success"
        showIcon
        style={{
          marginBottom: '18px',
        }}
      />

      <Alert
        message="推荐作品时要把握作品导向和品质格调，对于搞震惊体、悬疑体等标题党，出现猎奇、恐怖、血腥和渲染悲情惨剧内容，炒作娱乐花边、八卦绯闻、鸡毛蒜皮琐事，照搬照抄其他媒体原创内容或同类题材报道角度雷同、缺少创新等问题的作品，坚决不进入“三好”榜单。请如实填报稿件数据，新闻处将定期对进入榜单的作品进行数据核实，若发现数据不实情况，将取消评选资格，并在新闻视频通气会上通报。"
        type="error"
        showIcon
        style={{
          marginBottom: '18px',
        }}
      />

      <ProFormRadio.Group
        name="reportType"
        label={
          <>
            <span
              style={{
                color: '#ff4d4f',
                paddingRight: 4,
              }}
            >
              *
            </span>
            报道类型
          </>
        }
        radioType="button"
        options={[
          {
            label: '好报道',
            value: 1,
          },
          {
            label: '好评论',
            value: 2,
          },
          {
            label: '好创意报道',
            value: 3,
          },
        ]}
        fieldProps={{
          buttonStyle: 'solid',
          onChange(e) {
            setQuerySubmitParamReportTypeState(e.target.value);
            loadSaveRecordVerify(e.target.value, querySubmitParamReleaseDate);
          },
        }}
      />
      {querySubmitParamReportType && (
        <Alert
          message={
            querySubmitParamReportType == 1
              ? ' “好报道”是指及时准确报道新近发生事实或反映社会生活、揭示社会问题，导向正确、正能量充沛的优秀新闻作品。这类作品主要包括时政报道、经济新闻、社会热点和舆论监督等。'
              : querySubmitParamReportType == 2
              ? ' “好评论”是指准确客观评析新闻事件、热点话题和社会现象，有效凝聚社会共识、纠正错误认识的优秀新闻作品。这类作品主要是表明立场、亮明观点的言论评论。'
              : ' “好创意作品”是指应用融媒体技术创新报道表现形式和表达方式，内容积极健康、受到网民好评的优秀新闻作品。这类作品主要侧重展现文化魅力、自然风光，侧重反映百姓生活、衣食住行，侧重技术创新、技术赋能。'
          }
          type="warning"
          showIcon
          style={{
            marginBottom: '18px',
          }}
        />
      )}
      <ProFormDatePicker
        width="md"
        name="releaseDate"
        label={
          <>
            <span
              style={{
                color: '#ff4d4f',
                paddingRight: 4,
              }}
            >
              *
            </span>
            发布日期
          </>
        }
        // extra={
        //   <>
        //     选择范围 {dayjs(releaseTimes[0]).format('YYYY/MM/DD')} -
        //     {dayjs(releaseTimes[1]).format('YYYY/MM/DD')}
        //   </>
        // }
        fieldProps={{
          format: 'YYYY-MM-DD',
          allowClear: true,
          maxDate: dayjs().endOf('day'),
          onChange(date, dateString) {
            if (dateString) {
              setQuerySubmitParamReleaseDateState(dateString + ' 00:00:00');
              loadSaveRecordVerify(querySubmitParamReportType, dateString + ' 00:00:00');
            } else {
              setQuerySubmitParamReleaseDateState(undefined);
            }
          },
          showToday: false,
        }}
      />
      {querySubmitParamReportType && querySubmitParamReleaseDate && (
        <>
          {querySubmitVerifyState != undefined && querySubmitVerifyState.isVerify == 1 && (
            <>
              <Divider
                orientation="left"
                style={{
                  fontSize: 14,
                  fontWeight: 'bold',
                }}
              >
                基础数据
              </Divider>
              <ProFormTextArea
                width="xl"
                name="name"
                label={
                  <>
                    <span
                      style={{
                        color: '#ff4d4f',
                        paddingRight: 4,
                      }}
                    >
                      *
                    </span>
                    标题
                  </>
                }
                fieldProps={{
                  showCount: true,
                  allowClear: true,
                  rows: 3,
                  count: { show: true, max: 100 },
                  style: { resize: 'none' },
                }}
              />
              <Form.Item
                label={
                  <>
                    <span
                      style={{
                        color: '#ff4d4f',
                        paddingRight: 4,
                      }}
                    >
                      *
                    </span>
                    作者
                  </>
                }
                name="authors"
                extra={<div>最少输入一个</div>}
              >
                <TagGroup addText="点击添加" />
              </Form.Item>
              <ProFormTextArea
                width="xl"
                name="reason"
                label={
                  <>
                    <span
                      style={{
                        color: '#ff4d4f',
                        fontSize: 14,
                        paddingRight: 4,
                      }}
                    >
                      *
                    </span>
                    推荐理由
                  </>
                }
                fieldProps={{
                  allowClear: true,
                  rows: 7,
                  count: { show: true, max: 200 },
                }}
              />

              {interactionData && (
                <>
                  <Divider
                    orientation="left"
                    style={{
                      fontSize: 14,
                      fontWeight: 'bold',
                    }}
                  >
                    互动数据
                  </Divider>
                  <Descriptions column={4}>
                    {interactionData.dataReadCount != undefined && (
                      <Descriptions.Item label="阅读量">
                        {interactionData?.dataReadCount}
                      </Descriptions.Item>
                    )}
                    {interactionData.dataPlayCount != undefined && (
                      <Descriptions.Item label="播放量">
                        {interactionData?.dataPlayCount}
                      </Descriptions.Item>
                    )}
                    <Descriptions.Item label="点赞量">
                      {interactionData?.dataLikeCount}
                    </Descriptions.Item>
                    <Descriptions.Item label="转发量">
                      {interactionData?.dataCollectCount}
                    </Descriptions.Item>
                  </Descriptions>
                </>
              )}
              <Divider
                orientation="left"
                style={{
                  fontSize: 14,
                  fontWeight: 'bold',
                }}
              >
                发布数据
              </Divider>
              <Flex justify={'flex-end'} align={'center'}>
                <AddRecordProve
                  onRefurbish={function (): void {}}
                  onSave={async (data: AssessWeekEmphasizeProveBo.ProveData) => {
                    const proves = [...saveProves, data];

                    /**
                     * 阅读量【自媒体、社交媒体等平台的文章被阅读次数】
                     */
                    let dataReadCount: number | undefined = undefined;

                    /**
                     * 播放量【抖音、快手等视频站点的视频播放次数】
                     */
                    let dataPlayCount: number | undefined = undefined;

                    /**
                     * 点赞量【自媒体、社交媒体等平台的发布文章被点赞次数】
                     */
                    let dataLikeCount = 0;

                    /**
                     * 转发量
                     */
                    let dataCollectCount = 0;

                    proves.forEach((item) => {
                      if (
                        item.appointSourceChannelName == '微信公众号' ||
                        item.appointSourceChannelName == '微博' ||
                        item.appointSourceChannelName == '今日头条' ||
                        item.appointSourceChannelName == '客户端' ||
                        item.appointSourceChannelName == '网站'
                      ) {
                        if (dataReadCount == undefined) {
                          dataReadCount = 0;
                        }

                        dataReadCount = dataReadCount + item.dataReadCount;
                      } else {
                        if (dataPlayCount == undefined) {
                          dataPlayCount = 0;
                        }

                        dataPlayCount = dataPlayCount + item.dataPlayCount;
                      }
                      dataLikeCount = dataLikeCount + item.dataLikeCount;
                      dataCollectCount = dataCollectCount + item.dataCollectCount;
                    });

                    setInteractionDataState({
                      dataReadCount,
                      dataPlayCount,
                      dataLikeCount,
                      dataCollectCount,
                    });

                    setSaveProveState(proves);
                  }}
                />
              </Flex>
              <ProList<AssessWeekEmphasizeProveBo.ProveData>
                toolBarRender={false}
                rowKey="appointSourceId"
                showActions="hover"
                grid={{ gutter: 16, column: 1 }}
                headerTitle={false}
                dataSource={saveProves}
                actionRef={userRefProList}
                itemCardProps={{
                  bodyStyle: {
                    paddingTop: 0,
                    paddingLeft: 12,
                    paddingRight: 12,
                    paddingBottom: 12,
                  },
                }}
                metas={{
                  title: {
                    render: (
                      dom: React.ReactNode,
                      entity: AssessWeekEmphasizeProveBo.ProveData,
                      index: number,
                      action,
                    ) => {
                      let icon;
                      if (entity.appointSourceChannelName == '微信公众号') {
                        icon = <IconWeChatOfficialAccount width={15} height={15} />;
                      } else if (entity.appointSourceChannelName == '微信视频号') {
                        icon = <IconWeChatChannels width={15} height={15} />;
                      } else if (entity.appointSourceChannelName == '微博') {
                        icon = <IconWeibo width={15} height={15} />;
                      } else if (entity.appointSourceChannelName == '抖音') {
                        icon = <IconDouyin width={15} height={15} />;
                      } else if (entity.appointSourceChannelName == '今日头条') {
                        icon = <IconToutiao width={15} height={15} />;
                      } else if (entity.appointSourceChannelName == '快手') {
                        icon = <IconKuaishou width={15} height={15} />;
                      } else if (entity.appointSourceChannelName == '哔哩哔哩') {
                        icon = <IconBiliBili width={15} height={15} />;
                      } else if (entity.appointSourceChannelName == '客户端') {
                        icon = <IconApp width={15} height={15} />;
                      } else if (entity.appointSourceChannelName == '网站') {
                        icon = <IconWeb width={15} height={15} />;
                      }
                      return (
                        <Space align={'center'}>
                          <Tag color={entity.appointSourceType == 1 ? 'gold' : 'green'}>
                            {entity.appointSourceType == 1 ? '官方' : '轻骑兵'}
                          </Tag>
                          <Flex justify={'center'} align={'center'}>
                            {icon}
                            <span
                              style={{
                                // marginTop: 2,
                                marginLeft: 5,
                              }}
                            >
                              {entity.appointSourceName}
                            </span>
                          </Flex>
                        </Space>
                      );
                    },
                  },

                  content: {
                    render: (
                      dom: React.ReactNode,
                      entity: AssessWeekEmphasizeProveBo.ProveData,
                      index: number,
                      action,
                    ) => {
                      return (
                        <div>
                          <Descriptions
                          // column={4}
                          >
                            {entity.appointSourceChannelName == '微信公众号' ||
                            entity.appointSourceChannelName == '微博' ||
                            entity.appointSourceChannelName == '今日头条' ||
                            entity.appointSourceChannelName == '客户端' ||
                            entity.appointSourceChannelName == '网站' ? (
                              <Descriptions.Item label="阅读量">
                                {entity?.dataReadCount}
                              </Descriptions.Item>
                            ) : (
                              <Descriptions.Item label="播放量">
                                {entity?.dataPlayCount}
                              </Descriptions.Item>
                            )}
                            <Descriptions.Item label="点赞量">
                              {entity?.dataLikeCount}
                            </Descriptions.Item>
                            <Descriptions.Item label="转发量">
                              {entity?.dataCollectCount}
                            </Descriptions.Item>
                          </Descriptions>
                          {entity.url && (
                            <Typography.Paragraph style={{}}>
                              <blockquote>{entity.url}</blockquote>
                            </Typography.Paragraph>
                          )}
                          <Upload
                            listType="picture-card"
                            fileList={entity?.attachments?.map((item) => {
                              return {
                                uid: item.uid,
                                name: item.name,
                                url: item.url,
                                mimeType: item.mimeType,
                                status: 'done',
                              };
                            })}
                            showUploadList={{
                              showRemoveIcon: false,
                              showPreviewIcon: false,
                            }}
                          />
                          {entity.remarks && (
                            <Typography.Paragraph style={{}}>
                              <blockquote>{entity.remarks}</blockquote>
                            </Typography.Paragraph>
                          )}
                        </div>
                      );
                    },
                  },
                  actions: {
                    cardActionProps: 'extra',
                    render: (
                      dom: React.ReactNode,
                      entity: AssessWeekEmphasizeProveBo.ProveData,
                      index: number,
                      action,
                    ) => [
                      <>
                        {entity.datahubChannelName == '微信视频号' && entity.dataUrl && (
                          <span
                            style={{
                              fontSize: '14px',
                              color: '#00000073',
                            }}
                          >
                            注：该视频号链接只在微信移动端可用
                          </span>
                        )}
                      </>,
                      <EditRecordProve
                        data={entity}
                        onRefurbish={function (): void {}}
                        onSave={function (data: AssessWeekEmphasizeProveBo.ProveData): void {
                          let proves = saveProves.map((item) => {
                            if (item.id == data.id) {
                              return {
                                id: data.id,
                                appointSourceId: data.appointSourceId,
                                appointSourceType: data.appointSourceType,
                                appointSourceName: data.appointSourceName,
                                appointSourceChannelId: data.appointSourceChannelId,
                                appointSourceChannelName: data.appointSourceChannelName,
                                url: data.url,
                                dataReadCount: data.dataReadCount,
                                dataPlayCount: data.dataPlayCount,
                                dataLikeCount: data.dataLikeCount,
                                dataCollectCount: data.dataCollectCount,
                                attachments: data.attachments,
                                remarks: data.remarks,
                              };
                            } else {
                              return item;
                            }
                          });

                          /**
                           * 阅读量【自媒体、社交媒体等平台的文章被阅读次数】
                           */
                          let dataReadCount: number | undefined = undefined;

                          /**
                           * 播放量【抖音、快手等视频站点的视频播放次数】
                           */
                          let dataPlayCount: number | undefined = undefined;

                          /**
                           * 点赞量【自媒体、社交媒体等平台的发布文章被点赞次数】
                           */
                          let dataLikeCount = 0;

                          /**
                           * 转发量
                           */
                          let dataCollectCount = 0;

                          proves.forEach((item) => {
                            if (
                              item.appointSourceChannelName == '微信公众号' ||
                              item.appointSourceChannelName == '微博' ||
                              item.appointSourceChannelName == '今日头条' ||
                              item.appointSourceChannelName == '客户端' ||
                              item.appointSourceChannelName == '网站'
                            ) {
                              if (dataReadCount == undefined) {
                                dataReadCount = 0;
                              }

                              dataReadCount = dataReadCount + item.dataReadCount;
                            } else {
                              if (dataPlayCount == undefined) {
                                dataPlayCount = 0;
                              }

                              dataPlayCount = dataPlayCount + item.dataPlayCount;
                            }
                            dataLikeCount = dataLikeCount + item.dataLikeCount;
                            dataCollectCount = dataCollectCount + item.dataCollectCount;
                          });

                          setInteractionDataState({
                            dataReadCount,
                            dataPlayCount,
                            dataLikeCount,
                            dataCollectCount,
                          });

                          setSaveProveState(proves);

                          userRefProList.current?.reload();
                        }}
                      />,
                      <ModalForm
                        key={'modal_form_release_state_discard'}
                        title={
                          <>
                            <CloseCircleTwoTone
                              style={{
                                marginRight: 8,
                              }}
                              twoToneColor="#ff4d4f"
                            />
                            确认移除
                          </>
                        }
                        trigger={
                          <a
                            key="delete"
                            style={{
                              color: '#ff4d4f',
                            }}
                            onClick={() => {}}
                          >
                            移除
                          </a>
                        }
                        autoFocusFirstInput
                        modalProps={{
                          width: 400,
                          destroyOnClose: true,
                          onCancel: () => console.log('run'),
                        }}
                        submitTimeout={2000}
                        submitter={{
                          submitButtonProps: {
                            type: 'primary',
                            style: { background: '#ff4d4f' },
                          },
                        }}
                        onFinish={async (values) => {
                          /**
                           * 阅读量【自媒体、社交媒体等平台的文章被阅读次数】
                           */
                          let dataReadCount: number | undefined = undefined;

                          /**
                           * 播放量【抖音、快手等视频站点的视频播放次数】
                           */
                          let dataPlayCount: number | undefined = undefined;

                          /**
                           * 点赞量【自媒体、社交媒体等平台的发布文章被点赞次数】
                           */
                          let dataLikeCount = 0;

                          /**
                           * 转发量
                           */
                          let dataCollectCount = 0;

                          const proves = saveProves.filter(
                            (item) => item.appointSourceId != entity.appointSourceId,
                          );

                          proves.forEach((item) => {
                            if (
                              item.appointSourceChannelName == '微信公众号' ||
                              item.appointSourceChannelName == '微博' ||
                              item.appointSourceChannelName == '今日头条' ||
                              item.appointSourceChannelName == '客户端' ||
                              item.appointSourceChannelName == '网站'
                            ) {
                              if (dataReadCount == undefined) {
                                dataReadCount = 0;
                              }

                              dataReadCount = dataReadCount + item.dataReadCount;
                            } else {
                              if (dataPlayCount == undefined) {
                                dataPlayCount = 0;
                              }

                              dataPlayCount = dataPlayCount + item.dataPlayCount;
                            }
                            dataLikeCount = dataLikeCount + item.dataLikeCount;
                            dataCollectCount = dataCollectCount + item.dataCollectCount;
                          });

                          setInteractionDataState({
                            dataReadCount,
                            dataPlayCount,
                            dataLikeCount,
                            dataCollectCount,
                          });

                          setSaveProveState(proves);

                          return true;
                        }}
                      />,
                      ,
                    ],
                  },
                }}
              />
            </>
          )}
          {querySubmitVerifyState != undefined && querySubmitVerifyState.isVerify == 0 && (
            <>
              <Divider
                orientation="left"
                style={{
                  fontSize: 14,
                  fontWeight: 'bold',
                  color: 'red',
                }}
              >
                提示
              </Divider>
              {querySubmitVerifyState.records && (
                <>
                  <Alert
                    message={
                      <>
                        <div>
                          已在所选发布日期的一周内（{querySubmitVerifyState.monday}至
                          {querySubmitVerifyState.sunday}
                          ）提交过"三好稿件"。如果想重新提交，可在有效时间范围内，点击下方稿件标题，打开详情页，点击窗口右下角的”主动下架“进行删除。
                        </div>
                      </>
                    }
                    type="warning"
                    showIcon
                  />
                  <ProTable<AssessWeekEmphasizeRecordData.RecordPage>
                    columns={[
                      {
                        title: (
                          <span
                            style={{
                              color: '#99a3b7',
                              fontSize: 12,
                              textAlign: 'center',
                              fontWeight: 'normal',
                            }}
                          >
                            报道类型
                          </span>
                        ),
                        width: '40px',
                        dataIndex: 'dataReportType',
                        align: 'center',
                        render: (dom, entity, index, action) => {
                          let color = '';
                          let label = '';

                          if (entity.dataReportType == 1) {
                            color = 'green';
                            label = '好报道';
                          } else if (entity.dataReportType == 2) {
                            color = 'blue';
                            label = '好评论';
                          } else if (entity.dataReportType == 3) {
                            color = 'orange';
                            label = '好创意报道';
                          }

                          return <Tag color={color}>{label}</Tag>;
                        },
                      },
                      {
                        title: (
                          <span
                            style={{
                              color: '#99a3b7',
                              fontSize: 12,
                              textAlign: 'center',
                              fontWeight: 'normal',
                            }}
                          >
                            标题
                          </span>
                        ),
                        dataIndex: 'dataName',
                        align: 'center',
                        copyable: true,
                        ellipsis: true,
                        width: '60%',
                        render: (dom, entity, index, action) => (
                          <div
                            style={{
                              textAlign: 'left',
                              textOverflow: 'ellipsis',
                              whiteSpace: 'nowrap',
                              overflow: 'hidden',
                            }}
                          >
                            <DetailRecord
                              entrance="record"
                              id={entity.id}
                              name={entity.dataName}
                              exhibitionId={entity.exhibitionId}
                              onRefurbish={function (): void {}}
                              onExhibitionRefurbish={function (): void {}}
                            />
                          </div>
                        ),
                      },
                      {
                        title: (
                          <span
                            style={{
                              color: '#99a3b7',
                              fontSize: 12,
                              textAlign: 'center',
                              fontWeight: 'normal',
                            }}
                          >
                            发布日期
                          </span>
                        ),
                        dataIndex: 'dataReleaseTime',
                        align: 'center',
                        width: '70px',
                        render: (dom, entity, index, action) => {
                          return dayjs(entity.dataReleaseTime).format('YYYY-MM-DD');
                        },
                      },
                    ]}
                    rowKey="id"
                    dataSource={querySubmitVerifyState.records}
                    dateFormatter="id"
                    defaultSize={'small'}
                    pagination={false}
                    search={false}
                    options={{
                      density: false,
                      setting: false,
                    }}
                    ghost
                    headerTitle={<>已发布的重要稿件</>}
                  />
                </>
              )}
            </>
          )}
        </>
      )}
    </DrawerForm>
  );
};

export default EditRecord;
